<template>
  <div>
    <h2 class="x">{{ message }}</h2>
    <button @click="btnClick">按钮</button>
    <h2>{{ name }}</h2>
    <!-- 在组件中使用组件 -->
    <Cpn></Cpn>
    <!-- 大写小写都是可以的 -->
    <cpn />
  </div>
</template>

<script>
// 导入Cpn
import Cpn from './Cpn' // 有简写的办法

export default {
  name: "App",
  // 在组件里注册组件
  components: {
    Cpn
  },
  data() {
    return {
      message: 'Hello Webapck',
      name: '张三'
    }
  },
  methods: {
    btnClick() {

    }
  }
}
</script>

<style scoped>
.x {
  color: red;
}
</style>